<style>
    body{
        font:unset !important;
    }
    .card-order{
        background: #eee;
        padding-bottom: 20px;
        border-radius: 10px;
        width: 80%;
        margin: auto;
        margin-top: 30px;
        font-size: 15px;
    }
    section {
        display: block;
    }
    .card-order__section {
        padding-top: 1rem;
        border-bottom: 1px solid #ccc;
    }
    .card__container {
        display: flex;
        flex-direction: column;
        width: 100%;
        padding: 0 10px;
    }
    li{
        line-height: 30px;
    }
    .card-order-section{
        padding: 2rem;
        border-bottom: 1px solid #ccc;
    }
    .card-order__customer-list {
        display: flex;
        flex-direction: row;
        list-style: none;
        padding: 10px 18px
    }
    .card-order__customer-item{
        padding-left: 10px;
    }
    .title{
        font-size: 20px;
        line-height: 40px;
        padding-left: 30px;
    }
    .gutter-bottom-sm{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
    .card__title{
        padding-bottom: 10px;
    }
    .table {
        width: 100%;
        color: inherit;
    }
    .table__header{
        height: 50px;
        text-align: left;
    }
    .text-nowrap{
        padding-left: 20px;
    }
    .text-light-theme{
        padding-left: 20px;
    }
    .text-center{
        text-align: center;
    }
    .card-order__total-item{
        display: flex;
        flex-direction: row;
        padding-bottom: 1.6rem;

    }
    .card-order__total-value{
        padding-left: 50px;
    }
</style>
<div class="card-order">
    <div class="card__wrapper">
        <section class="card-order__section">
            <div class="card__container">
                <div class="title">
                    用户信息
                </div>
                <ul class="card-order__customer-list">
                    <li class="card-order__customer-item">
                        <b>下单用户:</b> <span>{$row.realname}</span>
                    </li>
                    <li class="card-order__customer-item">
                        <b>联系电话:</b>  <span>{$row.umobile}</span>
                    </li>
                    <li class="card-order__customer-item">
                       <b>下单时间:</b>  <span>{$row.create_time}</span>
                    </li>
                </ul>
            </div>
        </section>

        <section class="card-order-section">
            <div class="card__container">
                <div class="gutter-bottom-sm">
                    <div class="col">
                        <h3 class="card__title">订单信息</h3>
                        <div class="card-order__address">
                            <ul class="card-order__list">
                                <li><span>订单号:</span> {$row.orderno}</li>
                                <li><span>订单状态</span> {$row.statusname}</li>
                            </ul>
                            <ul class="card-order__list">
                                <li><span>下单电话:</span> {$row.mobile}</li>
                            </ul>
                            <ul class="card-order__list">
                                <li><span>支付时间</span> {$row.pay_time}</li>
                                <li><span>核销时间</span> {$row.hx_time}</li>
                            </ul>
                        </div>
                    </div>
                    <div class="col">
                        <h3 class="card__title">支付方式</h3>
                        <div class="card-order__address">
                            <ul class="card-order__list">
                                <li><span>{if condition="$row.pay_type eq 1"}微信支付{else /}支付宝支付{/if}</span></li>
                                <li><span>支付金额</span> ￥{$row.payprice|default='--'}</li>
                            </ul>
                            <ul class="card-order__list">

                                <li><span>核销人：</span> {$row.hxnickName|default='--'}</li>
                            </ul>
                        </div>
                    </div>
                    <div class="col d-none d-xl-block"></div>
                </div>
            </div>
        </section>
        <div class="card-order__product card-order__section" style="padding-bottom: 2rem;">
            <table class="table table--lines table--groups table--striped">
                <thead class="table__header">
                <tr class="table__header-row">
                    <th><span class="text-nowrap">商品详情</span></th>
                    <th class="text-center"><span>商家信息</span></th>
                    <th class="text-center"><span>价格</span></th>
                    <th class="text-center"><span>商品数量</span></th>
                    <th class="text-center"><span>合计</span></th>
                </tr>
                </thead>
                <tbody>
                <tr class="table__row">
                    <td class="table__td">
                        <div class="mw-200">
                            <span class="text-light-theme">{$row.goods_title}&nbsp; {$row.option_name}</span>
                        </div>
                    </td>
                    <td class="text-center">
                        {$row.manager}
                    </td>
                    <td class="text-center">
                        ￥{$row.goods_price}
                    </td>
                    <td class="text-center">
                        X{$row.goods_num}
                    </td>
                    <td class="text-center">￥{$row.orderprice}</td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="card-order__footer-total">
        <div class="card__container" style="padding: 0 0px;">
            <div class="gutter-bottom-sm" style="padding-top: 50px;">
                <div class="card-order__footer-submit col-12 col-sm">
                    &nbsp;
                </div>
                <div class="col-auto" style="margin-right: 46px;">
                    <ul class="card-order__total">
                        <li class="card-order__total-item">
                            <div class="card-order__total-title">合计金额:</div>
                            <div class="card-order__total-value">￥{$row.orderprice}</div>
                        </li>
                        <li class="card-order__total-item">
                            <div class="card-order__total-title">抵扣金额:</div>
                            <div class="card-order__total-value">￥{$row.discount}</div>
                        </li>
                        <li class="card-order__total-item card-order__total-footer">
                            <div class="card-order__total-title">应付金额:</div>
                            <div class="card-order__total-value">￥{$row.payprice}</div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="layuimini-container">
        <form id="app-form" class="layui-form layuimini-form">
            <div class="refusetable active">
                <div class="layui-form-item">
                    <label class="layui-form-label">订单备注</label>
                    <div class="layui-input-block">
                        <textarea  name="reason" style="height: 100px;width: 500px;">{$row.remark|raw}</textarea>
                    </div>
                </div>
            </div>
            <div class="layui-form-item text-center">
                <button type="submit" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit>确认</button>
                <button type="reset" class="layui-btn layui-btn-primary layui-btn-sm">重置</button>
            </div>
        </form>
    </div>
</div>